<template>
  <div class="system-role-dialog-container">
    <el-dialog :title="state.dialog.title" center class="borderRadius10" v-model="state.dialog.isShowDialog"
      width="490">
      <el-form ref="roleDialogFormRef" v-if="state.dialog.type == 'record'" label-width="120px">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="审核记录：">
              <div>{{ state.agentAuditRecord }}</div>
            </el-form-item>
          </el-col>
          <el-col class="mb20">
            <el-form-item label="审核时间：">
              <section>
                <div>
                  {{ formatDate(new Date(state.agentApplyTime), 'YYYY-mm-dd HH:MM:SS')
                  }}
                </div>
              </section>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!-- <el-form ref="roleDialogFormRef" v-if="state.dialog.type == 'audit'" label-width="120px">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item>
              <div>代理审核</div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form> -->
      <el-form ref="roleDialogFormRef" v-if="state.dialog.type == 'reject'" label-width="120px">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">

            <el-form-item label="驳回原因：">
              <el-input class="width260" maxlength="100" show-word-limit v-model="state.ruleForm.agentPerformanceDesc"
                type="textarea" placeholder="请输入调整原因" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="onCancel">取 消</el-button>
          <el-button type="primary" @click="onSubmitForm()">
            {{ state.dialog.submitTxt }}
          </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">

import { defineAsyncComponent, reactive, onMounted, ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import type { FormInstance, FormRules } from 'element-plus'
import { useRouter } from 'vue-router';
import { formatDate } from '/@/utils/formatTime';


// 定义子组件向父组件传值/事件
const emit = defineEmits(['opration']);
// 定义变量内容
const addSpecRef = ref<FormInstance>();
// 定义变量内容
const roleDialogFormRef = ref();
const state = reactive({
  loading: false,


  dialog: {
    isShowDialog: false,
    type: 'audit',
    title: '',
    submitTxt: '',
  },
  ruleForm: {
    agentAuditId: "",//审核记录id
    agentPerformanceDesc: "" //驳回原因
  },
  agentAuditRecord: "",//审核记录
  agentApplyTime: "" //审核时间
});




// 打开弹窗
const openDialog = (type: string, row?: any) => {
  console.log(row)
  state.dialog.type = type
  state.ruleForm.agentAuditId=row.agentAuditId
  if (type === 'audit') {
    state.dialog.title = '审核通过';
    state.dialog.submitTxt = '通 过';
  } else if (type === 'record') {
    state.dialog.title = '审核记录';
    state.dialog.submitTxt = '确 定';
    state.agentAuditRecord = row.agentAuditRecord
  } else if (type === 'reject') {
    state.dialog.title = '审核驳回';
    state.dialog.submitTxt = '驳 回';

  }

  state.dialog.isShowDialog = true;
};




// 关闭弹窗
const closeDialog = () => {
  state.dialog.isShowDialog = false;
};
// 取消
const onCancel = () => {
  closeDialog();
};


// 添加规格项
const onSubmitForm = () => {
  // console.log(formEl)
  // if (!formEl) return;
  // formEl.validate(async (valid: boolean) => {
  //   if (valid) {
  if (state.dialog.type == "audit") {
    let param = {
      type: state.dialog.type,
      agentAuditId: state.ruleForm.agentAuditId
    }
    emit('opration', param);
    closeDialog();

  } else if (state.dialog.type == "reject") {
    let param = {
      type: state.dialog.type,
      agentAuditId: state.ruleForm.agentAuditId,
      agentPerformanceDesc: state.ruleForm.agentPerformanceDesc
    }
    emit('opration', param);
    closeDialog();
  } else {
    closeDialog();

  }

  // } else {
  //   return false;
  // }
  // });
};

// 暴露变量
defineExpose({
  openDialog,
});
</script>

<style scoped lang="scss"></style>
